<!DOCTYPE html>
<style>
#target {
  -webkit-clip-path: circle(0px at 1px 2px);
  transition: -webkit-clip-path 1s;
}
</style>
This test must be run under the test harness.
<div id="target"></div>
<script>
if (window.testRunner) {
  testRunner.dumpAsText();
  testRunner.waitUntilDone();
}
var target = document.getElementById('target');
var result = '';
onload = function() {
  target.style.webkitClipPath = getComputedStyle(target).webkitClipPath;
  requestAnimationFrame(step1);
};
function step1() {
  target.offsetTop;
  result = document.getAnimations().length == 0 ?
      'PASS - No transition started.' :
      'FAIL - Unexpected transition started.';
  target.style.webkitClipPath = 'circle(200px at 0px 0px)';
  requestAnimationFrame(step2);
}
function step2() {
  result += document.getAnimations().length == 1 ?
      '\nPASS - Transition started.' :
      '\nFAIL - Transition did not start.';
  document.documentElement.style.whiteSpace = 'pre';
  document.documentElement.textContent = result;
  if (window.testRunner) {
    testRunner.notifyDone();
  }
}
</script>
